<script setup>
    import { ref, reactive, watch } from "vue"
    // 1.监视简单数据
    const val = ref(0)
    watch(val, (newVal, oldVal) => {
      console.log(newVal, oldVal)
    })
    // 2.监视复杂数据
    const obj = reactive({
      name: "careathers",
      age: 18
    })
    watch(obj, (oldVal, newVal) => {
      console.log(newVal, oldVal)
    })
</script>

<template>
  <div>
    <!-- 监视简单 -->
    <button @click="val++">监视简单数据示例</button>
    <p></p>
    <!-- 监视复杂 -->
     <button @click="obj.age++">监视复杂数据示例</button>
  </div>
</template>

<style scoped>

</style>